<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">

  <title>防疫2048</title>

  <!--http://www.html5rocks.com/en/mobile/mobifying/-->
  <meta name="viewport"
    content="width=device-width,user-scalable=no,initial-scale=1, minimum-scale=1,maximum-scale=1" />

  <!--https://developer.apple.com/library/safari/documentation/AppleApplications/Reference/SafariHTMLRef/Articles/MetaTags.html-->
  <meta name="apple-mobile-web-app-capable" content="yes">
  <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
  <meta name="format-detection" content="telephone=no">

  <!-- force webkit on 360 -->
  <meta name="renderer" content="webkit" />
  <meta name="force-rendering" content="webkit" />
  <!-- force edge on IE -->
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
  <meta name="msapplication-tap-highlight" content="no">

  <!-- force full screen on some browser -->
  <meta name="full-screen" content="yes" />
  <meta name="x5-fullscreen" content="true" />
  <meta name="360-fullscreen" content="true" />

  <!-- force screen orientation on some browser -->
  <meta name="screen-orientation" content="" />
  <meta name="x5-orientation" content="">

  <!--fix fireball/issues/3568 -->
  <!--<meta name="browsermode" content="application">-->
  <meta name="x5-page-mode" content="app">

  <!--<link rel="apple-touch-icon" href=".png" />-->
  <!--<link rel="apple-touch-icon-precomposed" href=".png" />-->

  <link rel="stylesheet" type="text/css" href="style-mobile.css" />
  <link rel="icon" href="favicon.ico" />
  <style>
    #splash {
      position: fixed;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      background: url('') no-repeat center;
      background-color: #F0FAFF;
      background-size: cover;
      display: none;
    }

    /* .appBackHomeBtn {
      position: fixed;
      top: 1.5rem;
      left: 0;
      width: 1.12rem;
      height: 0.8rem;
      display: none;
      background: url('https://static.yunjiglobal.com/qnUpload/frontend/yjgame/static/fanhuianniu.png');
      background-size: 100% 100%;
    } */

    #progress {
      position: fixed;
      font-size: 0.4rem;
      line-height: .56rem;
      color: #4D4D4D;
      left: 50%;
      top: 50%;
      transform: translate(-50%, .16rem);
      width: 6rem;
      text-align: center;
    }

    .loading-icon {
      position: fixed;
      width: 4.53rem;
      height: 2.39rem;
      left: 50%;
      top: 50%;
      transform: translate(-50%, -2.39rem);
    }
  </style>
</head>

<body>
  <canvas id="GameCanvas" oncontextmenu="event.preventDefault()" tabindex="0"></canvas>
  <div id="splash">
    <!-- <div class="progress-bar stripes">
      <span style="width: 0%"></span>
    </div> -->
    <img class="loading-icon" src="./2048loading.gif" />
    <div class="progress" id="progress">加载中...</div>
  </div>
  <!-- <div id="appBackHomeBtn" class="appBackHomeBtn"></div> -->
  <!-- <audio id="bg" preload="preload"
    src="https://static.yunjiglobal.com/qnUpload/frontend/yunjichickengame/static/config/music.mp3"
    loop=""></audio> -->
  <audio id="effect1" preload="preload"
    src="https://static.yunjiglobal.com/2048/compose.mp3"></audio>
  <audio id="effect2" preload="preload"
    src="https://static.yunjiglobal.com/2048/victory.mp3"></audio>
  <script>
    // var appBackHomeBtn = document.getElementById('appBackHomeBtn');
    // if (/yunji/ig.test(navigator.appVersion)) {
    //   console.log('@xts->html appBackHomeBtn isyunji');
    //   appBackHomeBtn.style.display = 'block';
    //   appBackHomeBtn.addEventListener('ontouchstart', () => {
    //     window.location.href = 'yunji://common/goHome';
    //   });
    // }
  </script>
  <script>
    getRem(750, 100);
    window.onresize = function () {
      getRem(750, 100)
    };
    function getRem(pwidth, prem) {
      var html = document.getElementsByTagName("html")[0];
      var oWidth = document.body.clientWidth || document.documentElement.clientWidth;
      html.style.fontSize = oWidth / pwidth * prem + "px";
    }
  </script>
  <script>
    document.addEventListener("WeixinJSBridgeReady", function () {
      console.log('@xts->WeixinJSBridgeReady');
      //document.getElementById('bg').load();
      document.getElementById('effect1').load();
      document.getElementById('effect2').load();
    }, false);
  </script>
  <script src="src/settings.js" charset="utf-8"></script>
  <script src="main.js" charset="utf-8"></script>
  <script src="vconsole.min.js" charset="utf-8"></script>
  <script type="text/javascript">
    (function () {
      // open web debugger console
      if (typeof VConsole !== 'undefined') {
        window.vConsole = new VConsole();
      }

      var splash = document.getElementById('splash');
      splash.style.display = 'block';

      var cocos2d = document.createElement('script');
      cocos2d.async = true;
      cocos2d.src = window._CCSettings.debug ? 'cocos2d-js.js' : 'cocos2d-js-min.js';

      var engineLoaded = function () {
        document.body.removeChild(cocos2d);
        cocos2d.removeEventListener('load', engineLoaded, false);
        window.boot();
      };
      cocos2d.addEventListener('load', engineLoaded, false);
      document.body.appendChild(cocos2d);
    })();
  </script>
  
</body>

</html>